<!DOCTYPE html>
<html lang="zn-CH">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小米商城</title>
    <link rel="stylesheet" href="../css/w.css">
    <link rel="stylesheet" href="../css/title.css">
    <link rel="stylesheet" href="../css/article.css">
    <link rel="stylesheet" href="../css/nav.css">
    <link rel="stylesheet" href="../css/header.css">
    <link rel="stylesheet" href="../css/footer.css">
    <link rel="stylesheet" href="../iconfont/iconfont.css">
</head>

<body>
    <!-- title 开始 -->
    <div class="title">
        <div class="w">
            <ul class="left">
                <li><a href="#">小米官网</a></li>
                <li>|</li>
                <li><a href="#">小米商城</a></li>
                <li>|</li>
                <li><a href="#">MIUI</a></li>
                <li>|</li>
                <li><a href="#">IoT</a></li>
                <li>|</li>
                <li><a href="#">云服务</a></li>
                <li>|</li>
                <li><a href="#">天星数科</a></li>
                <li>|</li>
                <li><a href="#">有品</a></li>
                <li>|</li>
                <li><a href="#">小爱开放平台</a></li>
                <li>|</li>
                <li><a href="#">企业团购</a></li>
                <li>|</li>
                <li><a href="#">资质证照</a></li>
                <li>|</li>
                <li><a href="#">协议规则</a></li>
                <li>|</li>
                <li class="app">
                    <div>
                        <a href="#">下载app</a>
                        <div class="ma">
                            <span></span>
                            <div>
                                <img src="../images/download.png" alt="">
                                <a href="https://www.mi.com/appdownload" target="_blank">
                                    <p>小米商城APP</p>
                                </a>
                            </div>
                        </div>
                    </div>
                </li>
                <li>|</li>
                <li><a href="#">Select Location</a></li>
            </ul>
            <ul class="right">
                <li><a href="#">登录</a></li>
                <li>|</li>
                <li><a href="#">注册</a></li>
                <li>|</li>
                <li><a href="#">消息通知</a></li>
                <li>
                    <a href="#"><i class="iconfont">&#xe600;</i>购物车 (0)</a>
                    <div class="jindu">
                        <div class="body">
                            <div class="son1"></div>
                            <div class="son2"></div>
                            <div class="son3"></div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!-- title 结束 -->

    <!-- article 开始 -->
    <article class="w">
        <div class="title-body">
            <h1><a href="../html/index.html" title="小米首页">首页</a></h1>
            <ul>
                <li><a href="#">Xiaomi手机</a></li>
                <li><a href="#">Redmi手机</a></li>
                <li><a href="#">电视</a></li>
                <li><a href="#">笔记本</a></li>
                <li><a href="#">平板</a></li>
                <li><a href="#">家电</a></li>
                <li><a href="#">路由器</a></li>
                <li><a href="#">服务中心</a></li>
                <li><a href="#">社区</a></li>
            </ul>
            <div class="search">
                <input type="text" placeholder="请输入搜索内容">
                <button class="iconfont"><b>&#xe610;</b></button>
            </div>
        </div>
    </article>
    <!-- article 结束 -->

    <!-- nav 开始 -->
    <nav>
       <div><a href="#"><i class="iconfont">&#xe601;</i><p>手机APP</p></a>
        <div><img src="../images/download.png">
        <p>扫码赢取新人百元红包</p></div>
    </div>
       <div><a href="#"><i class="iconfont">&#xe657;</i><p>个人中心</p></a></div>
       <div><a href="#"><i class="iconfont">&#xe659;</i><p>售后服务</p></a></div>
       <div><a href="#"><i class="iconfont">&#xec2e;</i><p>人工客服</p></a></div>
       <div><a href="#"><i class="iconfont">&#xe600;</i><p>购物车</p></a></div>
       <div><a href="#"><i class="iconfont">&#xe691;</i><p>回顶部</p></a></div>
    </nav>
    <!-- nav 结束 -->

    <!-- header 开始 -->
    <header>
        <div class="w header-title">
            <div class="header-right">
                <ul class="header-left">
                    <li><a href="#one">手机<i class="iconfont">&#xe670;</i></a></li>
                    <li><a href="#two">电视<i class="iconfont">&#xe670;</i></a></li>
                    <li><a href="#three">家电<i class="iconfont">&#xe670;</i></a></li>
                    <li><a href="#four">笔记本 平板<i class="iconfont">&#xe670;</a></i></li>
                    <li><a href="#five">出行 穿戴<i class="iconfont">&#xe670;</i></a></li>
                    <li>耳机 音箱<i class="iconfont">&#xe670;</i></li>
                    <li>健康 儿童<i class="iconfont">&#xe670;</i></li>
                    <li>生活 箱包<i class="iconfont">&#xe670;</i></li>
                    <li>智能 路由器<i class="iconfont">&#xe670;</i></li>
                    <li>电源 配件<i class="iconfont">&#xe670;</i></li>
                </ul>
                <a href="#"><img src="../images/2000.jpg"></a>
            </div>
            <!-- header-article 开始 -->
            <div class="header-article">
                <ul class="header-article-left">
                    <li><a href="#"><i class="iconfont">&#xe74f;</i>
                            <p>保障服务</p>
                        </a></li>
                    <li><a href="#"><i class="iconfont">&#xebc2;</i>
                            <p>企业团购</p>
                        </a></li>
                    <li><a href="#"><i class="iconfont">&#xe602;</i>
                            <p>F码通道</p>
                        </a></li>
                    <li><a href="#"><i class="iconfont">&#xe6ca;</i>
                            <p>米粉卡</p>
                        </a></li>
                    <li><a href="#"><i class="iconfont">&#xe60e;</i>
                            <p>以旧换新</p>
                        </a></li>
                    <li><a href="#"><i class="iconfont">&#xe66f;</i>
                            <p>话费充值</p>
                        </a></li>
                </ul>
                <ul class="header-article-right">
                    <li><a href="#"><img src="../images/7.jpg"></a></li>
                    <li><a href="#"><img src="../images/f.jpg"></a></li>
                    <li><a href="#"><img src="../images/a.jpg"></a></li>
                </ul>
            </div>
            <!-- header-article 结束 -->
        </div>

        <!-- header-body 开始 -->
        <div class="header-body ">
            <div class="header-body-img w">
                <a href="#"><img src="../images/23.jpg" alt=""></a>
            </div>
            <ul class="header-shopping w">
                <li class="shop">
                    <div class="header-title-search" id="one">
                        <h2>手机</h2>
                        <span><a href="phone.html" style="border:0;">查看更多<i class="iconfont">&#xe744;</i></a></span>
                    </div>
                    <ul>
                        <li class="first-child"><a href="#"><img src="../images/phone1.jpg"
                                    style="width: 270px;height:750px;"></a></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone2.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone3.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">徕卡光学全焦段四摄| 一英寸可变光圈| 徕卡专业街拍模式
                                    </p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone4.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone5.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">骁龙8+|2K 高光直屏|5500mAh+67W闪充</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone6.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone8.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone9.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/phone10.jpg">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="shop">
                    <div class="header-title-search" id="five">
                        <h2>智能穿戴</h2>
                        <span><a href="watch.html" style="margin-right:50px;">耳机</a>
                            <a href="watch.html">穿戴</a></span>
                    </div>
                    <ul>
                        <li class="first-child"><a href="#"><img src="../images/watch1.png"
                                    style="width: 270px;height:750px;"></a></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch2.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch3.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">徕卡光学全焦段四摄| 一英寸可变光圈| 徕卡专业街拍模式
                                    </p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch4.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch5.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">骁龙8+|2K 高光直屏|5500mAh+67W闪充</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch6.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch7.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/watch8.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li class="last-child">
                            <div>
                                <div class="last-child-body">
                                    <a href="#">
                                        <img src="../images/watch9.png">
                                        <h4>米家波轮洗衣机 10kg</h4>
                                        <p style="color:rgb(255, 108, 23);">999元</p>
                                    </a>
                                </div>
                                <div class="last-child-body"><a href="#">
                                        <i class="iconfont">&#xe744;</i>
                                        <h3>浏览更多</h3>
                                        <p style="color:rgb(176, 176, 176);">热门</p>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="shop">
                    <div class="header-title-search" id="four">
                        <h2>笔记本 | 平板</h2>
                        <span><a href="computer.html">热门</a></span>
                    </div>
                    <ul>
                        <li class="first-child"><a href="#"><img src="../images/computer1.png"
                                    style="width: 270px;height:750px;"></a></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer2.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer3.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">徕卡光学全焦段四摄| 一英寸可变光圈| 徕卡专业街拍模式
                                    </p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer4.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer5.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">骁龙8+|2K 高光直屏|5500mAh+67W闪充</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer6.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer7.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/computer8.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li class="last-child">
                            <div>
                                <div class="last-child-body">
                                    <a href="#">
                                        <img src="../images/computer9.png">
                                        <h4>米家波轮洗衣机 10kg</h4>
                                        <p style="color:rgb(255, 108, 23);">999元</p>
                                    </a>
                                </div>
                                <div class="last-child-body"><a href="#">
                                        <i class="iconfont">&#xe744;</i>
                                        <h3>浏览更多</h3>
                                        <p style="color:rgb(176, 176, 176);">热门</p>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="shop">
                    <div class="header-title-search" id="two">
                        <h2>家电</h2>
                        <span><a href="tv.html" style="margin-right:50px;">热门</a>
                            <a href="tv.html">电视影音</a></span>
                    </div>
                    <ul>
                        <li><div><a href="#"><img src="../images/tv1.png" style="width:100%;height:100%;"></a></div></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv2.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv3.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">徕卡光学全焦段四摄| 一英寸可变光圈| 徕卡专业街拍模式
                                    </p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv4.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv5.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">骁龙8+|2K 高光直屏|5500mAh+67W闪充</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li><div><a href="#"><img src="../images/tv6.png" style="width:100%;height:100%;"></a></div></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv7.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv8.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/tv9.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li class="last-child">
                            <div>
                                <div class="last-child-body">
                                    <a href="#">
                                        <img src="../images/xiyiji.png">
                                        <h4>米家波轮洗衣机 10kg</h4>
                                        <p style="color:rgb(255, 108, 23);">999元</p>
                                    </a>
                                </div>
                                <div class="last-child-body"><a href="#">
                                        <i class="iconfont">&#xe744;</i>
                                        <h3>浏览更多</h3>
                                        <p style="color:rgb(176, 176, 176);">热门</p>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="shop">
                    <div class="header-title-search" id="three">
                        <h2>生活电器</h2>
                        <span>
                            <a href="#" style="margin-right:50px;">电暖器</a>
                            <a href="#" style="margin-right:50px;">扫地机</a>
                            <a href="#" style="margin-right:50px;">空净</a>
                            <a href="#">清洁</a></span>
                    </div>
                    <ul>
                        <li><div><a href="#"><img src="../images/robot.png" style="width:100%;height:100%;"></a></div></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot1.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot2.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">徕卡光学全焦段四摄| 一英寸可变光圈| 徕卡专业街拍模式
                                    </p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot3.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot4.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">骁龙8+|2K 高光直屏|5500mAh+67W闪充</p>
                                    <p style="margin-top:10px;color:rgb(255, 108, 23);">2499元起</p>
                                </a>
                            </div>
                        </li>
                        <li><div><a href="#"><img src="../images/robot5.png" style="width:100%;height:100%;"></a></div></li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot6.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;"><span style="color:rgb(255, 108, 23);">2499元起</span><del
                                            style="margin-left:5px;color:rgb(177, 177, 177);">2600元</del></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot7.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;"><span style="color:rgb(255, 108, 23);">2499元起</span><del
                                            style="margin-left:5px;color:rgb(177, 177, 177);">2600元</del></p>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div>
                                <a href="#">
                                    <img src="../images/robot8.png">
                                    <p style="margin-top:20px;">Xiaomi Civi 3</p>
                                    <p style="margin-top:10px;color:rgb(176, 176, 176);">仿生双眸 天生出色</p>
                                    <p style="margin-top:10px;"><span style="color:rgb(255, 108, 23);">2499元起</span><del
                                            style="margin-left:5px;color:rgb(177, 177, 177);">2600元</del></p>
                                </a>
                            </div>
                        </li>
                        <li class="last-child">
                            <div>
                                <div class="last-child-body">
                                    <a href="#">
                                        <img src="../images/robot9.png">
                                        <h4>米家波轮洗衣机 10kg</h4>
                                        <p style="color:rgb(255, 108, 23);">999元</p>
                                    </a>
                                </div>
                                <div class="last-child-body"><a href="#">
                                        <i class="iconfont">&#xe744;</i>
                                        <h3>浏览更多</h3>
                                        <p style="color:rgb(176, 176, 176);">热门</p>
                                    </a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
            </ul>
        </div>
    </header>
    <!-- header 结束 -->

    <!-- footer 开始 -->
    <footer>
        <ul class="footer-service w">
            <li><a href="#">
                    <h2><i class="iconfont">&#xe659;</i>预约维修服务</h2>
                </a></li>
            <li><a href="#">
                    <h2><i class="iconfont">&#xe63d;</i>7天无理由退货</h2>
                </a></li>
            <li><a href="#">
                    <h2><i class="iconfont">&#xe606;</i>15天免费换货</h2>
                </a></li>
            <li><a href="#">
                    <h2><i class="iconfont">&#xe604;</i>满69元包邮</h2>
                </a></li>
            <li><a href="#">
                    <h2><i class="iconfont">&#xe603;</i>1100余家售后网点</h2>
                </a></li>
        </ul>
        <div class="footer-body w">
            <ul>
                <li>
                    <h2>选购指南</h2>
                </li>
                <li><a href="#"></a></li>
                <li><a href="#">电视</a></li>
                <li><a href="#">笔记本</a></li>
                <li><a href="#">平板</a></li>
                <li><a href="#">穿戴</a></li>
                <li><a href="#">耳机</a></li>
                <li><a href="#">家电</a></li>
                <li><a href="#">路由器</a></li>
                <li><a href="#">音箱</a></li>
                <li><a href="#">配件</a></li>
            </ul>
            <ul>
                <li>
                    <h2>服务中心</h2>
                </li>
                <li><a href="#">申请售后</a></li>
                <li><a href="#">售后政策</a></li>
                <li><a href="#">维修服务价格</a></li>
                <li><a href="#">订单查询</a></li>
                <li><a href="#">以旧换新</a></li>
                <li><a href="#">保障服务</a></li>
                <li><a href="#">防伪查询</a></li>
                <li><a href="#">F码通道</a></li>
            </ul>
            <ul>
                <li>
                    <h2>线下门店</h2>
                </li>
                <li><a href="#">小米之家</a></li>
                <li><a href="#">服务网点</a></li>
                <li><a href="#">授权体验店/专区</a></li>
            </ul>
            <ul>
                <li>
                    <h2>关于小米</h2>
                </li>
                <li><a href="#">了解小米</a></li>
                <li><a href="#">加入小米</a></li>
                <li><a href="#">投资者关系</a></li>
                <li><a href="#">可持续发展</a></li>
                <li><a href="#">廉洁举报</a></li>
            </ul>
            <ul>
                <li>
                    <h2>关注我们</h2>
                </li>
                <li><a href="#">新浪微博</a></li>
                <li><a href="#">官方微信</a></li>
                <li><a href="#">联系我们</a></li>
                <li><a href="#">公益基金会</a></li>
            </ul>
            <div class="footer-body-right">
                <p style="font-size:25px;color:rgb(255, 108, 23);">400-100-5678</p>
                <p style="margin:10px 0">8:00-18:00 (仅收市话费)</p>
                <div class="footer-body-right-div"><a href="#"><i class="iconfont">&#xe67a;</i>人工客服</a></div>
                <p style="font-size:30px;color:rgb(255, 108, 23);margin:10px 0">叶佳均</p>
                <p>202200310177</p>
            </div>
        </div>
    </footer>
    <!-- footer 结束 -->
</body>

</html>